<!----------------------------PHP---------------------------------------->
<?php
		
if(isset($allProcedures))
{
	//print_r($allProcedures);
}	


if($allInventoryItems)
{
	echo "<script>var itemList = new Array();</script>";
	
	foreach($allInventoryItems as $item)
	{
		echo "<script>itemList.push(['".$item->getInventoryId()."','".$item->getProductName()."']);</script>";
	}
}


if(isset($selectedProcId))
{

echo "<script>var itemNameList = new Array();</script>";
echo "<script>var itemQtyList = new Array();</script>";
echo "<script>var itemIdList = new Array();</script>";

	//echo($selectedProcId);
	$mycount=0;
	$itemNameList = array();
	$itemQtyList = array();
	
	foreach($allProcedures as $p)
	{
		if($p->getProcedureId() == $selectedProcId)
		{
		
			foreach($allProceduresItems as $procItem)
			{
				if($procItem->getProcedureId() == $selectedProcId)
				{
					array_push($itemQtyList,$procItem->getQuantityNeeded());
					echo "<script>itemQtyList.push(".$procItem->getQuantityNeeded().");</script>";
					
					foreach($allInventoryItems as $item)
					{
						if($procItem->getInventoryId() == $item->getInventoryId())
						{//echo $item->getProductName();
							array_push($itemNameList,"Item#".$item->getInventoryId()." - " .$item->getProductName());
							echo "<script>itemIdList.push('".$item->getInventoryId()."');</script>";
							echo "<script>itemNameList.push('Item#".$item->getInventoryId()." - ".$item->getProductName()."');</script>";
							
						}
					}
					
				}
			}
			
			$selectedProcIndex = $mycount;
		}	
		$mycount++;
	}
	
		
}


function spacing($i)
{
	$gap="";
	
		for($x=0; $x<$i; $x++)
		{
			$gap .= "<br>";
		}
			
	return $gap;
}

?>


<!------------------------------------------------------------------------>


<!----------------------------Javascript---------------------------------------->

<script>

//alert(itemIdList);
//alert(itemNameList);
//alert(itemQtyList);
	
var readOnly = true;
var selectedItem;

function selectProc()
{
	document.getElementById("procedureAction").value = "select";
	
	var procSelection = document.getElementById("procSelection");
	selectedProcIndex = procSelection.options[procSelection.selectedIndex].value;
	
	document.getElementById("selectedProcId").value = selectedProcIndex ;
	document.procedureForm.submit();
}

function selectItem(selectedItem)
{

	if(!readOnly)
	{
		var mySeletedItem = "item";
		mySeletedItem += selectedItem;
		
		var myRemoveBtn = "removeBtn";
		myRemoveBtn += selectedItem;
		
		//alert(mySeletedItem);
	
		if(document.getElementById("procedureAction").value != "selectItem")
		{
			document.getElementById(mySeletedItem).style.backgroundColor = "yellow";
			document.getElementById(myRemoveBtn).disabled = false;
		}
		else if(document.getElementById("procedureAction").value == "selectItem")
		{
			document.getElementById(mySeletedItem).style.backgroundColor = "transparent";
			document.getElementById(myRemoveBtn).disabled = true;
		}
	}
}

function removeItem(itemIndex)
{
	itemNameList.splice(itemIndex,1);
	itemQtyList.splice(itemIndex,1);
	itemIdList.splice(itemIndex,1);
	
	//alert(itemIdList);
	//alert(itemNameList);
	//alert(itemQtyList);
	
	createItemTable();	
}

function createItemTable()
{
	var tHeader="<table id='itemTable'>";	
	var tBody="";
	var tFooter="</table>";

	if(!readOnly)
	{	
		for(var x=0; x<itemNameList.length && x<itemQtyList.length; x++)
		{
			tBody += "<tr id='item" + x + "' ><td width='60%'>" + itemNameList[x] + "</td><td><input style='float:left' id='removeBtn" + x + "' type='button' onclick='removeItem(" + x +")' value='Remove'></td><td width='14%'><input size='5' id='quantity"+ x +"' type='text' value='"+ itemQtyList[x] +"'></td></tr>";
		}		
	}
	
	document.getElementById("itemTable").innerHTML = tHeader + tBody + tFooter;
}


function editProcedure()
{
	if(document.getElementById("procedureAction").value != "edit")
	{
		readOnly = false;
		document.getElementById("procedureAction").value = "edit"
		document.getElementById("editProcBtn").value = "Cancel Edit";
		document.getElementById("procName").disabled = false;
		document.getElementById("procDuration").disabled = false;
		document.getElementById("saveProcBtn").disabled = false;
		document.getElementById("createProcBtn").disabled = true;
		document.getElementById("deleteProcBtn").disabled = true;
		document.getElementById("addItemBtn").disabled = false;
		document.getElementById("itemSelection").disabled = false;
		
		
		for(var x=0; x<itemNameList.length && x<itemQtyList.length; x++)
		{
			document.getElementById("quantity" + x).disabled = false;
			document.getElementById("removeBtn" + x).disabled = false;
		}
		
		
	}
	else if(document.getElementById("procedureAction").value == "edit")
	{
		readOnly = true;
		document.getElementById("procedureAction").value = "select"
		document.procedureForm.submit();
		
	}
	
}

function addItem()
{

    
	//alert(itemNameList);
	//alert(itemIdList);
	//alert(itemQtyList);
	
	var itemSelection = document.getElementById("itemSelection");
	var itemSelected = itemSelection.options[itemSelection.selectedIndex].value;
	
	itemIdList.push((itemList[itemSelected])[0]);
	itemNameList.push("Item#" + (itemList[itemSelected])[0] + " - " + (itemList[itemSelected])[1]);
	itemQtyList.push(1);
	
	//alert(itemIdList);
	//alert(itemNameList);
	//alert(itemQtyList);
	
	createItemTable();
	
	
}

function saveProcedure()
{
	if(document.getElementById("procedureAction").value == "edit")
	{
		//alert("HERE" + document.getElementById("selectedProcId").value);
	
		var myProcedure = [document.getElementById("selectedProcId").value,document.getElementById("procName").value,document.getElementById("procDuration").value];
	
		document.getElementById("proc_procedure").value = myProcedure;
		document.getElementById("proc_itemList").value = itemIdList;
		
		for(var a=0; a<itemNameList.length; a++)
		{
			itemQtyList[a] = document.getElementById("quantity" + a).value;
		}
		
		document.getElementById("proc_quantityList").value = itemQtyList;
	}
	else if(document.getElementById("procedureAction").value == "create")
	{
		var myProcedure = ["",document.getElementById("procName").value,document.getElementById("procDuration").value];
	
		document.getElementById("proc_procedure").value = myProcedure;
		document.getElementById("proc_itemList").value = itemIdList;
		
		for(var a=0; a<itemNameList.length; a++)
		{
			itemQtyList[a] = document.getElementById("quantity" + a).value;
		}
		
		document.getElementById("proc_quantityList").value = itemQtyList;
	}
	
	//alert("READY!!!!!!!");
	
	//alert(myProcedure);
	//alert(itemIdList);
	//alert(itemQtyList);
	
	//alert(document.getElementById("proc_procedure").value);
	//alert(document.getElementById("proc_itemList").value);
	//alert(document.getElementById("proc_quantityList").value);
	
	document.procedureForm.submit();
	
}

function deleteProcedure()
{
	document.getElementById("procedureAction").value = "delete"
	document.procedureForm.submit();
}

function createProcedure()
{
	if(document.getElementById("procedureAction").value != "create")
	{
		readOnly = false;
		document.getElementById("procedureAction").value = "create"
		document.getElementById("createProcBtn").value = "Cancel Create"
		
		document.getElementById("editProcBtn").disabled = true;
		document.getElementById("deleteProcBtn").disabled = true;
		document.getElementById("saveProcBtn").disabled = false;
		document.getElementById("procSelection").disabled = true;
		document.getElementById("itemSelection").disabled = false;
		document.getElementById("addItemBtn").disabled = false;
		document.getElementById("procName").disabled = false;
		document.getElementById("procDuration").disabled = false;
		
		
		document.getElementById("procSelection").value = "-1";	
		document.getElementById("procName").value = "";
		document.getElementById("procDuration").value = "";
		
		myProcedure = new Array();
		itemIdList = new Array();
		itemQtyList = new Array();
		itemNameList = new Array();
		
		
//alert(myProcedure);
//alert(itemIdList);
//alert(itemQtyList);
//alert(itemNameList);
		
		createItemTable();	
		
	}
	else if(document.getElementById("procedureAction").value == "create")
	{
		readOnly = true;
		document.getElementById("procedureAction").value = "select";
		document.procedureForm.submit();
	}
	
	//alert(myProcedure);
	//alert(itemIdList);
	//alert(itemQtyList);
	
	
}


</script>


<!------------------------------------------------------------------------>




<td> 

<!------------------------------------------------------------------------>

<form name="procedureForm" action="#" method="post">
	<div class="round2Inventory">
	<table class="content">
	
	<tr>
		<td>Procedure<br><br></td>
		
		<td> 
			<input type="button" id="deleteProcBtn" value="Delete Procedure" class="right" onclick="deleteProcedure()" <?php if(isset($selectedProcId)){echo "enabled";}else{echo "disabled";} ?>>
			<input type="button" id="editProcBtn" value="Edit Procedure" onclick="editProcedure()" class="right" <?php if(isset($selectedProcId)){echo "enabled";}else{echo "disabled";} ?>>
			<input type="button" id="saveProcBtn" value="Save Procedure" class="right" onclick="saveProcedure()" disabled>
			<input type="button" id="createProcBtn" value="Create Procedure" class="right" onclick="createProcedure()">
			<input type="hidden" id="procedureAction" name="procedureAction" value="">
			<input type="hidden" id="selectedProcId" name="selectedProcId" value="<?php if(isset($selectedProcId)){echo $selectedProcId;}else{echo "";}?>">
			
			<input type="hidden" id="proc_procedure" name="proc_procedure" value="">
			<input type="hidden" id="proc_itemList" name="proc_itemList" value="">
			<input type="hidden" id="proc_quantityList" name="proc_quantityList" value="">
				
		</td>
	</tr>
	
	<tr>
		<td width="100%" colspan="6"><br><br>
			Select procedure:
			<table style="border:0px solid black; width:100%" colspan="4">
				<tr>
					<td><br>
						<select id="procSelection" onchange="selectProc()">
						<option value="-1"></option>
							<?php
						
								if(isset($allProcedures))
								{
									
									foreach($allProcedures as $procedure)
									{
										if(isset($selectedProcId) && $procedure->getProcedureId() == $selectedProcId)
										{
											$selected = "selected";
										}
										else
										{
											$selected = "";
										}
									
										echo "<option value='".$procedure->getProcedureId()."'".$selected.">".$procedure->getProcedureId()." - ".$procedure->getName()."</option>";
									}
								}
						
							?>
						</select>
					</td>
					<td style="float:right">
						<select id="itemSelection" disabled>
						<option value="-1"></option>
						<?php
						
							$index = 0;
						
								if(isset($allInventoryItems))
								{
									
									foreach($allInventoryItems as $item)
									{									
										echo "<option value='".$index."'>Item#".$item->getInventoryId()."   - ".$item->getProductName()."</option>";
										$index++;
									}
								}
						
							?>
						</select>
						
						<input id="addItemBtn" type="button" value="Add Item" onclick="addItem()" disabled>
					
					</td>
				</tr>
			</table>
		</td>
	</tr>
	
	<tr>
		<td colspan="2"><br><br>
			<div style="overflow:hidden; overflow-y:auto; height:300px;">
			<table style="border:0px solid black; width:100%; text-align:center" id="procTable">
				<tr>
					<th width="30%" >
						Procedure Name<span class="red">*</span>
					</th >
					
					<th width="20%">
						Duration(15X mins)<span class="red">*</span>
					</th>
					
					<th width="45%">
						Item Needed<span class="red">(*)</span>
					</th>
					
					<th width="5%">
						Quantity<span class="red">(*)</span>
					</th>
				</tr>
				<tr>	
					<td>
						<input type="text" id="procName" name="procName" value="<?php if(isset($selectedProcId)){echo $allProcedures[$selectedProcIndex]->getName();} ?>" disabled> <?php if(isset($itemNameList)){echo spacing(count($itemNameList));} ?>
					</td>
					<td>
						<input type="text" id="procDuration" name="procDuration" value="<?php if(isset($selectedProcId)){echo $allProcedures[$selectedProcIndex]->getDuration() ;}?>" disabled> <?php if(isset($itemNameList)){echo spacing(count($itemNameList));} ?>
					</td>
					<td colspan="2">
					
					<div id="itemTable">
						
					
							<?php
									
								if(isset($itemNameList) && isset($itemQtyList))
								{
									echo "<table id='itemTable'>";
									
									for($a=0; $a<count($itemNameList) && $a<count($itemQtyList); $a++)
									{
										echo "<tr id='item".$a."' disabled><td width='60%'>".$itemNameList[$a]."</td><td><input style='float:left' id='removeBtn".$a."' type='button' onclick='removeItem(".$a.")' value='Remove' disabled></td><td width='14%'><input id='quantity".$a."' type='text' value='".$itemQtyList[$a]."' disabled></td></tr>";
									}
									
									echo "</table>";
								}
							
							?>
								
					
					</div>	
						
						
					</td>
				</tr>
			</table>
			</div>
		</td>
	</tr>
	
	</table>
	</div>
</form>

					
<!------------------------------------------------------------------------>
			
			</td>
		</tr>